<template>
  <a-modal
    title="显示"
    :width="1500"
    :visible="visible"
    :confirmLoading="loading"
    :maskClosable="false"
    @cancel="handleCancel"
  >
    <a-spin :spinning="loading" v-if="type === 'pic'">
      <img :src="imgUrl">
    </a-spin>
    <a-spin :spinning="loading" v-if="type === 'xml'">
      {{ text }}
    </a-spin>
    <template slot="footer" >
      <div>
        <a-button key="cancel" @click="handleCancel">取消</a-button>
      </div>
    </template>
  </a-modal>
</template>

<script>
import { getFlowChart } from '@/api/process/model'
export default {
  name: 'ShowPicOrXml',
  components: {
  },
  data () {
    return {
      loading: false,
      tableData: [],
      visible: false,
      type: 'pic',
      imgUrl: '',
      text: ''
    }
  },
  computed: {
  },
  methods: {
    init (value, type) {
      this.visible = true
      this.loading = true
      this.type = type
      if (type === 'pic') {
        getFlowChart(value).then(res => {
          this.imgUrl = 'data:image/png;base64,' + btoa(new Uint8Array(res).reduce((data, byte) => data + String.fromCharCode(byte), ''))
          this.loading = false
        })
      } else if (type === 'xml') {
        this.text = value
        this.loading = false
      }
    },
    handleCancel () {
      this.visible = false
      setTimeout(() => {
        this.addable = false
        this.showable = false
        this.editable = false
      }, 200)
    }
  }
}
</script>

<style scoped>

</style>
